<template>
	<view class="container flex justify-center align-center bg-gradual-blue" :style="orientation=='portrait'?('background-image: url('+bgimage+');'):''">
		<view style="width: 80%;">
			<view class="padding-sm">
				<text class="cuIcon-medalfill "></text>
				<text class="margin-left text-size-30 text-white ">请选择进入系统</text></view>
			<view class="cu-card radius">
				<cu-grid :datas="menus" @onchange="onSelect"></cu-grid>
			</view>
		</view>
		
	</view>
</template>

<script>
	import cuGrid from '@/components/diy/list/cu-grid.vue';
	export default {
		components: {
			cuGrid
		},
		data() {
			return {
				orientation:this.Orientation,
				bgimage:require('@/static/bg/bg_login.jpg'),
				menus:[
					{
							title: '组件库',
							name: '组件库',
							color: 'cyan',
							cuIcon: 'newsfill',
							path:'/pages/index/component'
						},
						{
							title: '编辑器',
							name: '编辑器',
							color: 'blue',
							cuIcon: 'card',
							path:'/pages/diy/index'
						},
						{
							title: '商城',
							name: '商城',
							color: 'red',
							cuIcon: 'btn',
							path:'/pages/shop/index'
						}
				]
			}
		},
		methods: {
			onSelect: function(e) {
				console.log(e);
				this.$util.redirectTo(this.menus[e].path);
			}
		}
	}
</script>

<style scoped>
	.container{
		width: 100vw;
		height: 100vh;
		background-size: 100% 100%;
		background-color: #3F536E;
	}
</style>
